/** 
 * Creator:     JYW
 * CreatDate:   2019-04-17
 * descripts：  护士执行
*/

import React from 'react';
import { Tabs, Col, message, Badge, Radio, Row, DatePicker, TimePicker, Checkbox, Button, Tooltip } from 'antd'
import { $http } from '../../../containers/config/https';
import Moment from 'moment';
import './CSS/nurseexecute.less'; // 引入样式
import OrderItem from './OrderItem';

let user;
const TabPane = Tabs.TabPane;
class SheetList extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            iconType: "menu-fold",
            sheetList: [],
            defaultKey: '',
            badge: {},
            x: 0,
            loading: false,
            ordColumns: [], // 显示列
            ordData: [], // 医嘱信息
            sheet: {},
            activeKey: "0",
            stDate: "",
            stTime: "",
            endDate: "",
            endTime: "",
            creatFlag: false, // true:要求执行时间
            ordFlag: false,
            docFlag: true,
            longOrd: false,
            tempOrd: false,
            execFlag: false,
            printFlag: false,
            clickBtn: "",
            renderFlag: true,
            preExecFlag: '',
            patInfo: []
        }
        user = window.sessionStorage.userData ? JSON.parse(window.sessionStorage.userData) : {};
    }

    componentDidMount() {
        if (this.props.onRef) {
            this.props.onRef(this);
        }
        this.getSheetList();
        document.addEventListener("keydown", this.KeyDowns)
    }

    componentWillUnmount() {
        this.setState = (state, callback) => {
            return
        }
        window.removeEventListener("keydown", this.KeyDowns);
    }

    KeyDowns = (e) => {
        if (e) {
            //快捷查询医嘱
            if (event.keyCode == 112) {
                e.preventDefault();
                //编辑患者信息
                this.getPatientOrd("")
            }
        }
        //屏蔽浏览器自带f1帮助
        window.onhelp = function () {
            return false;
        }
    }

    getSheetList = () => {
        let data = {
            params: [{
                hospID: user.hospID,
                columnFlag: "1",
            }]
        }
        $http.post('urlDeault', this, {
            code: "04030007",
            data: data,
            success: (res) => {
                if (+res.errorCode === 0) {
                    this.setOrdColumns(res.result)
                } else {
                    message.error('未获取到单据：' + res.errorMessage);
                }
            }
        })
    }

    shouldComponentUpdate(nextProps, nextState) {
        if (nextState.renderFlag === this.state.renderFlag) {
            return false
        }
        return true;
    }

    getPatientOrd = (activeKey, e) => {
        let sheet = {};
        let startDate = '', startTime = '', endDate = '', endTime = ''
        if ((activeKey) && (activeKey !== "")) {
            sheet = this.state.sheetList[activeKey];
            startDate = sheet.startDate;
            startTime = sheet.startTime;
            endDate = sheet.endDate;
            endTime = sheet.endTime;
        } else {
            activeKey = this.state.activeKey;
            sheet = this.state.sheetList[activeKey];
        }
        // let obj = {};
        // obj.ordData = [];
        // obj.loading = true;
        // obj.renderFlag = !this.state.renderFlag;
        // this.setState(obj, () => {
        //     setTimeout(() => {
        //this.refs.OrderItem.setState({ loading: true, allChecked: false, orderCheck: [], detailCheck: [] });

        let data = {
            params: [{
                hospID: user.hospID,
                sheetCode: sheet.code,
                locID: user.locID,
                stDate: this.state.stDate ? this.state.stDate : startDate,
                stTime: this.state.stTime ? this.state.stTime : startTime,
                endDate: this.state.endDate ? this.state.endDate : endDate,
                endTime: this.state.endTime ? this.state.endTime : endTime,
                creatFlag: this.state.creatFlag ? "Y" : "N",
                ordFlag: this.state.ordFlag ? "Y" : "N",
                docFlag: this.state.docFlag ? "Y" : "N",
                longOrd: this.state.longOrd ? "Y" : "N",
                tempOrd: this.state.tempOrd ? "Y" : "N",
                execFlag: this.state.execFlag ? "Y" : "N",
                patients: this.props.patient,
            }]
        }
        $http.post('urlDeault', this, {
            code: "04030001",
            data: data,
            success: (res) => {
                if (+res.errorCode === 0) {
                    this.setState({
                        stDate: startDate ? startDate : this.state.stDate,
                        stTime: startTime ? startTime : this.state.stTime,
                        endDate: endDate ? endDate : this.state.endDate,
                        endTime: endTime ? endTime : this.state.endTime,
                        activeKey: activeKey, sheet: sheet, ordData: res.result.order,
                        loading: !this.state.loading,
                        renderFlag: !this.state.renderFlag, badge: res.result.badge
                    }, () => {
                        this.orderItemChild.handleCheckAll(true)
                    })
                    //this.refs.OrderItem.setState({ loading: false });
                } else {
                    this.setState({ activeKey: activeKey, sheet: sheet, loading: false, renderFlag: !this.state.renderFlag })
                    message.error('获取医嘱信息失败：' + res.errorMessage);
                    // this.refs.OrderItem.setState({ loading: false });
                }
            }
        })
    }

    onOrderItemChild = (ref) => {
        this.orderItemChild = ref
    }

    handleDateTimeChange = (flag, time, datetimeString) => {
        this.setState({ [flag]: datetimeString, renderFlag: !this.state.renderFlag });
    }

    onCheckChange = (checkBox, e) => {
        this.orderItemChild.setHandleOrderBtnStatus(e.target.checked)
        this.setState({ [checkBox]: e.target.checked, renderFlag: !this.state.renderFlag },
            () => { this.getPatientOrd() }
        )
    }
    // onSwitchChange = (flag, checked, e) => {

    onSwitchChange = (name, e) => {
        // this.setState({ [flag]: checked, renderFlag: !this.state.renderFlag })
        this.setState({ [name]: e.target.value, renderFlag: !this.state.renderFlag },
            () => { this.getPatientOrd() }
        )
    }

    onTabChange = (activeKey) => {
        this.getPatientOrd(activeKey);
    }

    setOrdColumns = (result) => {
        let stDate = result.default.startDate, stTime = result.default.startTime, endDate = result.default.endDate, endTime = result.default.endTime
        this.setState({
            sheetList: result.sheet,
            activeKey: result.default.seqNo + "",
            stDate: stDate,
            stTime: stTime,
            endDate: endDate,
            endTime: endTime,
            sheet: result.default,
            loading: false,
            renderFlag: !this.state.renderFlag,
            preExecFlag: result.preExecFlag
        })
    }

    onMenuFoldClick = () => {
        let obj = {};
        if (this.props.iconType === "double-left") {
            obj.leftspan = 5;
            obj.rightspan = 19;
            obj.iconType = "double-right"
            this.props.updateState(obj);
        } else {
            obj.leftspan = 0;
            obj.rightspan = 24;
            obj.iconType = "double-left"
            this.props.updateState(obj);

        }
    }

    setPatiInfo = (record, activeFlag) => {
        console.log('record', record)
        let patInfo = '';
        if (activeFlag === '1' && record) {
            let fColor = 'black';
            if (record.purposeBlanceIP <= 0 && record.admReasonDesc === '自费') {
                fColor = 'red';
            }
            patInfo = <div style={{ color: '#999', width: '100%', fontWeight: 'normal' }} className="flex-wrap-align-items">
                姓名:<span style={{ marginRight: '10px', color: fColor, fontWeight: 700 }}>{record?.patName || ''}</span>
                {record?.admBedRoom ? (
                    <>
                        床号:<span style={{ marginRight: '10px', color: fColor, fontWeight: 700 }}>{(record?.admBedRoom || '') + (record?.admBedCode ? ('-' + record?.admBedCode || '') : '')}</span>
                    </>
                ) : ''}
                {record?.admADDDiag ? (
                    <>
                        主诊断:
                        <Tooltip title={record?.admADDDiag || ''}>
                            <span className="ellipsis" style={{ maxWidth: '34%', display: 'block', marginRight: '10px', color: fColor }}>{record?.admADDDiag || ''}</span>
                        </Tooltip>
                    </>
                ) : ''}
                {record?.admReasonDesc ? (
                    <>
                        医保类型:<span style={{ marginRight: '10px', color: fColor }}>{record?.admReasonDesc || ''}</span>
                    </>
                ) : ''}
                {record?.totalAmtIP ? (
                    <>
                        总费用:<span style={{ marginRight: '10px', color: fColor }}>{record?.totalAmtIP || ''}</span>
                    </>
                ) : ''}
                {record?.accDepositIP ? (
                    <>
                        预交金:<span style={{ marginRight: '10px', color: fColor }}>{record?.accDepositIP || ''}</span>
                    </>
                ) : ''}
                {record?.purposeBlanceIP ? (
                    <>
                        余额:<span style={{ color: fColor }}>{record?.purposeBlanceIP || ''}</span>
                    </>
                ) : ''}
            </div>
        }
        this.setState({ patInfo: patInfo })
    }

    render() {
        let tabs = [];
        {
            this.state.sheetList.map(
                (sheet, index) => {
                    tabs.push(
                        <TabPane
                            tab={
                                <Badge dot={this.state.badge[sheet.code] === "1" ? true : false}>
                                    {sheet.descripts}
                                </Badge>
                            }
                            key={index + ""}
                            className="nurseExecute"
                            style={{ height: "100%", width: '100%' }}
                        >
                            {
                                (this.state.activeKey !== (index + "")) ? "" : sheet.columnInfo.column === undefined ? "未维护显示列信息" : (
                                    <OrderItem
                                        onOrderItemChild={this.onOrderItemChild}
                                        key={sheet.code}
                                        onCheckChange={this.onCheckItemChange}
                                        sheet={sheet}
                                        preExecFlag={this.state.preExecFlag}
                                        ordItem=""
                                        patIndex=""
                                        orderIndex=""
                                        ordData={this.state.ordData}
                                        x={sheet.columnInfo.x}
                                        type="C"
                                        getPatientOrd={this.getPatientOrd}
                                        loading={this.state.loading}
                                        activeSheet={this.state.sheetList[this.state.activeKey]}
                                        patListRef={this.props.patListRef ? this.props.patListRef : ''}
                                    />
                                )
                            }
                        </TabPane>
                    )
                }
            )
        }
        return (
            <div className="nurseExecute">
                {/* <Col span={1} style={{ width: "30px" }}>
                            <Icon style={{ color: "blue", fontSize: "20px" }} type={this.props.iconType} onClick={this.onMenuFoldClick} />
                        </Col> */}
                <Row style={{ boxSizing: 'border-box', padding: '0 24px', height: '38px', lineHeight: '38px', maxHeight: '38px' }} >
                    <Col xxl={{ span: 8 }} xl={{ span: 8 }} lg={{ span: 14 }} md={{ span: 24 }} className="xxl-8">
                        日期选择:
                        <DatePicker
                            onChange={this.handleDateTimeChange.bind(this, "stDate")}
                            value={(this.state.sheet.length === 0) || (this.state.stDate === "") ? null : Moment(this.state.stDate, 'YYYY-MM-DD')}
                            style={{ margin: '0 10px', width: '45%' }}
                        >
                        </DatePicker>

                        <TimePicker
                            style={{ width: '30%' }}
                            onChange={this.handleDateTimeChange.bind(this, "stTime")}
                            value={(this.state.sheet.length === 0) || (this.state.stTime === "") ? null : Moment(this.state.stTime, 'HH:mm:ss')}
                        >
                        </TimePicker>
                    </Col>

                    <Col xxl={{ span: 7 }} xl={{ span: 7 }} lg={{ span: 14 }} md={{ span: 24 }} className="xxl-7">
                        至:
                        <DatePicker
                            onChange={this.handleDateTimeChange.bind(this, "endDate")}
                            value={(this.state.sheet.length === 0) || (this.state.endDate === "") ? null : Moment(this.state.endDate, 'YYYY-MM-DD')}
                            style={{ margin: '0 10px', width: '45%' }}>
                        </DatePicker>
                        <TimePicker
                            style={{ width: '30%' }}
                            onChange={this.handleDateTimeChange.bind(this, "endTime")}
                            value={(this.state.sheet.length === 0) || (this.state.endTime === "") ? null : Moment(this.state.endTime, 'HH:mm:ss')}
                        >
                        </TimePicker>
                    </Col>
                    <Col xxl={{ span: 6 }} xl={{ span: 9 }} lg={{ span: 12 }} md={{ span: 24 }}>
                        <div style={{ display: 'flex' }}>
                            <div span={2} style={{ flex: '1', textAlign: 'center' }}>
                                <Checkbox
                                    checked={this.state.longOrd}
                                    onChange={this.onCheckChange.bind(this, "longOrd")}
                                >长期</Checkbox>
                            </div>
                            <div span={2} style={{ flex: '1', textAlign: 'center' }}>
                                <Checkbox
                                    checked={this.state.execFlag}
                                    onChange={this.onCheckChange.bind(this, "execFlag")}
                                >已执行</Checkbox>
                            </div>
                            <div span={2} style={{ flex: '1', textAlign: 'center' }}>
                                <Checkbox
                                    checked={this.state.ordFlag}
                                    onChange={this.onCheckChange.bind(this, "ordFlag")}
                                >医嘱</Checkbox>
                            </div>
                            <div span={2} style={{ flex: '1', textAlign: 'center' }}>
                                <Checkbox
                                    checked={this.state.tempOrd}
                                    onChange={this.onCheckChange.bind(this, "tempOrd")}
                                >临时</Checkbox>
                            </div>
                            {/* <div span={2} style={{ flex: '1', textAlign: 'center' }}>
                                        <Checkbox
                                            checked={this.state.printFlag}
                                            onChange={this.onCheckChange.bind(this, "printFlag")}
                                            style={{ marginTop: '10px' }}
                                        >已打印</Checkbox>
                                    </div> */}
                        </div>
                    </Col>
                </Row>
                <Row style={{ padding: "0 24px", height: '38px', lineHeight: '30px', maxHeight: '38px', borderBottom: '1px solid #cccccc' }}>
                    {/* <Col xxl={{ span: 3 }} xl={{ span: 5 }} lg={{ span: 12 }} md={{ span: 24 }} style={{ textAlign: 'left' }}>
                        <span style={{ width: '90px', textAlign: 'center' }}>护士医嘱</span>
                        <Switch
                            style={{ marginLeft: '10px' }}
                            checked={this.state.docFlag}
                            onChange={this.onSwitchChange.bind(this, "docFlag")}
                        />
                        <span style={{ marginLeft: '10px', width: '80px', textAlign: 'center' }}>医生医嘱</span>
                    </Col> */}
                    {/* <Col xxl={{ span: 3 }} xl={{ span: 5 }} lg={{ span: 12 }} md={{ span: 24 }} style={{ textAlign: 'left' }}>
                        <div className="createFlag">
                            <div className={`createFlagItem ${this.state.docFlag ? 'checked' : 'checkedNo-left'}` } style={{ }}
                                onClick={this.onSwitchChange.bind(this, "docFlag",true)}
                            >医生医嘱</div>
                            <div className={`createFlagItem ${this.state.docFlag ? 'checkedNo-right' : 'checked'}` } style={{}}
                                onClick={this.onSwitchChange.bind(this, "docFlag",false)}
                            >护士医嘱</div>
                        </div> 
                    </Col>
                    <Col xxl={{ span: 4 }} xl={{ span: 6 }} lg={{ span: 12 }} md={{ span: 24 }} style={{ textAlign: 'left' }}>
                        <span style={{ width: '90px'}}>要求执行时间</span>
                        <Switch
                            style={{ marginLeft: '10px' }}
                            checked={this.state.creatFlag}
                            onChange={this.onSwitchChange.bind(this, "creatFlag")}
                        />
                        <span style={{ marginLeft: '10px', width: '80px' }}>开医嘱时间</span>
                    </Col> */}
                    {/* <Col xxl={{ span: 4 }} xl={{ span: 6 }} lg={{ span: 12 }} md={{ span: 24 }} style={{ textAlign: 'left' }}>
                        <div className="createFlag">
                            <div className={`createFlagItem ${this.state.creatFlag ? 'checked' : 'checkedNo-left'}` } style={{ }}
                                onClick={this.onSwitchChange.bind(this, "creatFlag",true)}
                            >要求执行时间</div>
                            <div className={`createFlagItem ${this.state.creatFlag ? 'checkedNo-right' : 'checked'}` } style={{}}
                                onClick={this.onSwitchChange.bind(this, "creatFlag",false)}
                            >开医嘱时间</div>
                        </div>
                    </Col> */}
                    <Col xxl={{ span: 7 }} xl={{ span: 9 }} lg={{ span: 10 }} md={{ span: 24 }} style={{ textAlign: 'left' }}>
                        {/* <Col xxl={{ span: 8 }} xl={{ span: 11 }} lg={{ span: 12 }} md={{ span: 24 }} style={{ textAlign: 'left' }}> */}
                        <Radio.Group style={{ marginLeft: 10 }} onChange={this.onSwitchChange.bind(this, 'docFlag')} buttonStyle="solid" value={this.state.docFlag}>
                            <Radio.Button value={true}>医生医嘱</Radio.Button>
                            <Radio.Button value={false}>护士医嘱</Radio.Button>
                        </Radio.Group>
                        <Radio.Group style={{ marginLeft: 10 }} onChange={this.onSwitchChange.bind(this, 'creatFlag')} buttonStyle="solid" value={this.state.creatFlag}>
                            <Radio.Button value={false}>要求执行时间</Radio.Button>
                            <Radio.Button value={true}>开医嘱时间</Radio.Button>
                        </Radio.Group>
                    </Col>
                    <Col xxl={{ span: 15 }} xl={{ span: 13 }} lg={{ span: 12 }} md={{ span: 24 }}>
                        {/* <Col xxl={{ span: 14}} xl={{ span: 10 }} lg={{ span: 8}} md={{ span: 24 }}> */}
                        {this.state.patInfo}
                    </Col>
                    <Col xxl={{ span: 2 }} xl={{ span: 2 }} lg={{ span: 2 }} md={{ span: 24 }}>
                        {/* <Col xxl={{ span: 2, offset: 14 }} xl={{ span: 3, offset: 10 }} lg={{ span: 4, offset: 6 }} md={{ span: 24 }}> */}
                        <Button
                            onClick={this.getPatientOrd.bind(this, "")}
                            type="primary">
                            查询(F1)
                        </Button>
                    </Col>

                </Row>
                <Row style={{ height: 'calc(100% - 78px)', padding: '10px 20px' }}>
                    <Tabs
                        style={{ height: "100%", width: "100%" }}
                        onChange={this.onTabChange}
                        className="nurseExecute"
                        activeKey={this.state.activeKey}
                    >
                        {tabs}
                    </Tabs>
                </Row>
            </div>
        )
    }
}
export default SheetList